/**
* @Author: zmx
* @Date: 2023/9/26
* @Description:
*/
<template>
  <el-dialog :title="'新建图谱节点关系'" :visible.sync="show" append-to-body width="50%" :before-close="handleClose">
    <el-form :model="formInline">
      <el-row>
        <el-col :span="12">
          <el-form-item label="原节点类型：">
            <el-select
              v-model="formInline.startTag"
              value-key="id"
              filterable
              clearable
              @change="selectStartTag"
            >
              <el-option
                v-for="item in tagList"
                :key="item.name"
                :label="item.name"
                :value="item.name"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="目标节点类型：">
            <el-select
              v-model="formInline.endTag"
              value-key="id"
              filterable
              clearable
              @change="selectEndTag"
            >
              <el-option
                v-for="item in tagList"
                :key="item.name"
                :label="item.name"
                :value="item.name"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="原节点列表：">
            <el-select
              v-model="formInline.startVid"
              value-key="id"
              filterable
              clearable
            >
              <el-option
                v-for="item in startVidList"
                :key="item.id"
                :label="item.id"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="目标节点列表：">
            <el-select
              v-model="formInline.endVid"
              value-key="id"
              filterable
              clearable
            >
              <el-option
                v-for="item in endVidList"
                :key="item.id"
                :label="item.id"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="checkBtn">确 认</el-button>
      <el-button @click="handleClose">取 消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import {formatDate} from "@/utils/DateFormat"
import { showNebula, insertEdge, showTags } from "../../../../api/fault/index"
import tag from "element-ui/packages/tag";

export default {
  computed: {
    tag() {
      return tag
    }
  },
  props: ['ModelDialogShow', 'modelParam'], //接受父组件传递过来的数据
  data() {
    return {
      show: false, //弹窗默认隐藏
      tagList: [],
      edgeList: [],
      startVidList: [],
      endVidList: [],
      formInline: {

      },
      titleFront: '查看'
    };
  },
  mounted() {
    this.formInline = JSON.parse(JSON.stringify(this.modelParam))
    this.getInit()
    //显示弹窗
    if (this.formInline.type === 'add') {
      this.titleFront = '新建'
    } else if (this.formInline.type === 'edit') {
      this.titleFront = '编辑'
    }
    this.show = this.ModelDialogShow
  },
  methods: {
    formatTime(date) {
      return formatDate("YYYY-mm-dd HH:MM:SS", date)
    },
    handleClose() {
      //关闭弹窗
      this.show = false
      this.$emit('closeDialog')
    },
    checkBtn() {
      //确定按钮
      let data = {
        endVID: this.formInline.endVid,
        startVID: this.formInline.startVid,
        edgeName: "withP",
        propertyList: {}
      }
      insertEdge(data).then((res) => {
        // this.handleClose()
          if (res.code === 200){
            this.$message.info('创建成功');
            this.$emit('refreshGraph')
          }else {
              this.$message.info('创建失败：' + res.msg);
          }
      })
    },
    getInit() {
      showNebula({showName: "tags"}).then((res) => {
        this.tagList = res.data.nameList
      })
    },
    selectStartTag() {
      showTags({"tagName": this.formInline.startTag}).then((res) => {
        this.startVidList = res.data
      })
    },
    selectEndTag() {
      showTags({"tagName": this.formInline.endTag}).then((res) => {
        this.endVidList = res.data
      })
    }
  }
};
</script>

<style scoped>

</style>
